<template>
	<div>
		<div class="penalrow selectw100">
      <div class="inlineblock verticalmiddle infoitem" style="width:33%;">
          <div class="inlineblock verticalmiddle">
            能力参数
          </div>
          <div class="inlineblock verticalmiddle informationItem">
              <el-select v-model="abilityTableDateValue" placeholder="请选择" size="mini">
                <el-option
                  v-for="item in detectabilityData"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
                </el-option>
              </el-select>
          </div>
      </div>
      <div class="inlineblock verticalmiddle infoitem" style="width:33%;">
          <div class="inlineblock verticalmiddle">
            开始日期
          </div>
          <div class="inlineblock verticalmiddle informationItem">
              <el-date-picker
                    size="mini"
                    :editable="datapickereditable"
                    v-model="batchcreatetimestart"
                    type="date"
                    placeholder="选择起始日期"
                    style="width:100%;"
                    >
                  </el-date-picker>
          </div>
      </div>
      <div class="inlineblock verticalmiddle infoitem" style="width:33%;">
          <div class="inlineblock verticalmiddle">
            结束日期
          </div>
          <div class="inlineblock verticalmiddle informationItem">
              <el-date-picker
                    size="mini"
                    :editable="datapickereditable"
                    :picker-options="pickerenddatefanwei"
                    v-model="batchcreatetimeend"
                    type="date"
                    placeholder="选择结束日期"
                    style="width:100%;"
                    >
                  </el-date-picker>
          </div>
      </div>
    </div>
    <div class="penalrow selectw100">
      <div class="inlineblock verticalmiddle infoitem" style="width:33%;">
          <div class="inlineblock verticalmiddle">
            曲线状态
          </div>
          <div class="inlineblock verticalmiddle informationItem">
              <el-select v-model="enableStatusValue" placeholder="请选择" size="mini">
                <el-option
                  v-for="item in enableStatus"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
          </div>
      </div>
      <div class="basicRightDistanceA" style="position:absolute;">
          <el-button type="primary" size="mini">搜索</el-button>
        </div>
    </div>
    <div class="separaterow">
      <el-table
          :data="calibrationCurveTableDate"
          style="width: 100%"
          :height="tableHeightD"
          size="mini"
          
          key="calibrationCurveTableDate"
          >
          <el-table-column
            label="序号"
            min-width="50px"
            >
            <template slot-scope="scope">
              {{scope.$index+1}}
            </template>  
          </el-table-column>
          <el-table-column
            property="ccTime"
            label="曲线生产日期"
            min-width="100px">
               <template slot-scope="scope">
                	<!--{{scope.row.ccTime.split('.')[0]}}-->
                	{{scope.row.hasOwnProperty('ccTime')?scope.row.ccTime.split('.')[0]:'/'}}
                </template>
          </el-table-column>
          <el-table-column
            property="ccItems"
            label="能力参数"
            min-width="100px">
          </el-table-column>
          <el-table-column
            property="ccMethod"
            label="方法"
            min-width="100px">
          </el-table-column>
          <el-table-column
            property="ccUppeople"
            label="人员"
            min-width="100px">
          </el-table-column>
          <el-table-column
            property="ccStatus"
            label="曲线状态"
            min-width="100px">
          </el-table-column>
          <el-table-column
            label="操作"
            min-width="200px">
            <template slot-scope="scope">
              <el-button type="text" size="mini">详情</el-button>
              <el-button type="text" size="mini">设置默认</el-button>
            </template>
          </el-table-column>
      </el-table>
      <div class="block changepages">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="page"
          :page-sizes="[100, 200, 300, 400]"
          :page-size="100"
          layout="total, sizes, prev, pager, next, jumper"
          :total="400">
        </el-pagination>
      </div>
    </div>
	</div>
</template>

<script>
	import { mapState } from 'vuex'
	export default {
		props:{
	  },
	  data(){
			return {
				page: 1,
				tableHeightD: ((window.innerHeight - 300) / 3 - 25),
				demand:{
					detectability :'',
					startDate:'',
					endDate:'',
					status:'',
				},
				detectabilityData:[],
				 //校准曲线
	      abilityTableDateValue:'',
	      batchcreatetimestart:'',
	      batchcreatetimeend:'',
	      enableStatusValue: '',
	      calibrationCurveTableDate:[
		      {
		        ccID:'',
		        ccTime:'2018-01-01',
		        ccItems:'氨氮',
		        ccMethod:'纳氏试剂法',
		        ccUppeople:'检测员A',
		        ccStatus:'使用中'
		      }
	      ],
	      enableStatus: [	
	        {
	          value: 0,
	          label: '停用'
	        },
					{
	          value: 1,
	          label: '启用'
	        },
	        {
	          value: 2,
	          label: '草稿'
	        },
	        {
	          value: 3,
	          label: '待审核'
	        }  
	      ],
	      abilityTableDate: [
	      	{
	          typeofAbilityID: '10289001',
	          typeofAbilityName: '有机',
	          abilityStatus: '1',
	          sampleTypeID: '10001',
	          sampleTypeName: '水',
	          remark: '备注',
	          abilityID: '10011',
	          abilityName: '氨氮-纳氏试剂法',
	          abilityCode: '10011',
	          abilityMethod: '纳氏试剂法',
	          reportName: '氨氮',
	          mainEquipID: '10001',
	          mainEquipName: '主仪器',
	          frontEquipID: '100001',
	          frontEquipName: '副仪器',
	          banbenhao:'v1'
	       }
      	],
      	datapickereditable:false,
      	//截止日期可选范围
	      pickerenddatefanwei:{
	        disabledDate:function(time) {
//	            let timeSpace = time.getTime() < new Date((this.batchcreatetimestart?this.batchcreatetimestart:'1970-01-01')).getTime();
//	            return timeSpace;
	        }
	      },
			}
		},
		mounted(){
			this.detectabilityInit()
			this.init()
		},
		methods:{
			init(){
				this.$http({
				 	apiUrl: 'resource/readCritsByEquip.htm',
			    method: 'post',
			    params: this.demand,
				}).then(res=>{
					if(res.code == 0) {
					console.log(res.data)
					}
				})
			},
			detectabilityInit(){
				this.$http({
				 	apiUrl: 'resource/readDetectabilityComboList.htm',
			    method: 'get',
			    params: {equipment:this.demand.id},
				}).then(res=>{
					if(res.code == 0) {
						this.detectabilityData = res.data
					}
				})
			},
			handleSizeChange(){},
	    handleCurrentChange(){},
		}
	}
</script>

<style>
</style>